import { View, Image, Text } from '@tarojs/components'
import bg from '@/assets/user/bg-2.jpg'
import avavton from '@/assets/user/avanton.jpg'
import { AtIcon } from 'taro-ui'
import Taro from '@tarojs/taro'

export default function Bg() {
  const toLogin = () => {
    Taro.navigateTo({ url: '/pages/login/index' });
  }
  return (
    <View className='w-full aspect-100/99 overflow-hidden relative'>
      <View className='w-full aspect-40/33 overflow-hidden'><Image src={bg} className='w-full h-full object-cover' /></View>
      <View className='w-full h-auto absolute top-[260px] left-2/100 w-96/100 flex items-center gap-4' onClick={toLogin}>
        <View><Image src={avavton} className='w-16 h-16 rounded-full border-6 border-white' /></View>
        <View className='w-auto h-auto flex items-center'>
          <Text className='text-lg font-smibold text-white inline'>登录/注册</Text>
          <AtIcon value='chevron-right' size='24' color='#FFFFFF'></AtIcon>
        </View>
      </View>
      <View className='w-96/100 h-auto bg-white mx-auto flex flex-col gap-4 absolute left-2/100 bottom-[28px] px-4 py-5 rounded-lg'>
        <Text className='text-lg font-bold'>Lv1</Text>
        <Text>今天也要加油啊！</Text>
      </View>
    </View>
  )
}
